<template>
	<view class="page">
		<view class="healthy-box">
			<view class="text-area">
				<textarea class="text" v-model="pasteValue" @input="handleInput" placeholder="请输入短视频的分享链接地址"></textarea>
			</view>
			<view class="footer">
				<div class="button-cancel" @click="handlePaste">粘贴</div>
				<div class="button-confim"  @click="handleSave" size="medium" theme="primary"
					block>提取视频</div>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		config
	} from "@/static/config.js"
	import {
		onShow,
		onHide,
		onUnload
	} from '@dcloudio/uni-app'
	import {
		ref,
		onMounted,
		onUnmounted
	} from 'vue';
	import {
		save
	} from '@/api/pda/healthy';

	onShow(() => {
	})

	onHide(() => {
	})

	onUnload(() => {
	})
	let pasteValue = ref('');
	const toastFn = (msg) => {
		plus.nativeUI.toast(`<font style=\"font-size:14px\">${msg}</font>`, {
			verticalAlign: 'middle',
			type: 'richtext',
			duration: 'long',
			richTextStyle: {
				align: 'center'
			}
		})
	}
	const handleSave = () => {
		if(!pasteValue.value){
			// #ifdef APP-PLUS
			toastFn('请粘贴分享视频链接')
			// #endif
			// #ifdef H5
			uni.showToast({
				title: '请粘贴分享视频链接',
			});
			// #endif
			return;
		}
		let params={
				Code: 'Code',
				OpenId: 'OpenId',
				PreUrl: pasteValue.value,
			}
		save(params).then((res) => {
			if(res.isSucceed){
				let afterurl=res.data;
				uni.navigateTo({
				  url:'/pages/index/videoView?afterurl='+ res.data
				})
			}
		});
	};
	const handlePaste = () => {
	//	pasteValue.value =  navigator.clipboard.readText();
		
		pasteFromClipboard();

	};
	const handleInput=(event)=>{
	  // 检查是否为粘贴操作
	  if (event.inputType === 'insertFromPaste') {
		// 处理粘贴逻辑，例如清理或格式化粘贴内容
		const clipboardData = event.clipboardData || window.clipboardData;
		const pastedData = clipboardData.getData('Text');
		pasteValue.value = pastedData; // 直接更新text，或者进行其他处理
	  } else {
		// 普通输入处理
	  }
	}
	const pasteFromClipboard=()=> {
		if (typeof wx !== 'undefined') { // 判断是否在小程序环境
		  wx.getClipboardData({
			success: res => { pasteValue.value = res.data;console.log('tesst',res.data); }
		  });
		} else if (navigator.clipboard) { // 判断是否在浏览器环境支持剪贴板API
			console.log('tess',pasteValue.value);
			//pasteFromClipboardBrowser(); // 调用上面定义的浏览器方法
		} else {
		  alert('不支持的浏览器或环境');
		}
	};
	
	onMounted(() => {
	});
	onUnmounted(() => {
	});
</script>

<style lang="less" scoped>
	.healthy-box {
		box-sizing: border-box;
		width: 100%;
		min-height: 100vh;
		padding: 10px;
		overflow-y: auto;
		background-color: #f2f2f2;

		.text-area {
			display: flex;
			justify-content: space-around;
			width: 100%;
			height: 100px;
			.text{
				border: 1px solid #000;/* 隐藏边框 */
				background-color: #f0f0f0; /* 设置背景色 */
				padding: 10px; /* 设置内边距 */
				border-radius: 5px; /* 设置圆角 */
			}
		}
		.footer {
			display: flex;
			justify-content: space-around;
			width: 100%;
			margin-top: 100px;

			.t-button {
				width: 30%;
			}
		}
	}

	.page {
		box-sizing: border-box;
		width: 100%;
		height: 100vh;
		overflow-y: auto;
		background-color: #f2f2f2;
	}

	.error {
		color: #dd677d !important;
	}

	.success {
		color: #26a65b;
	}

	.button-confim {
		width: 120px;
		height: 40px;
		background-color: #23a7f2;
		cursor: pointer;
		color: #fff;
		font-size: 14px;
		font-weight: 500;
		text-align: center;
		line-height: 40px;
		border-radius: 5px;
	}

	.button-cancel {
		width: 120px;
		height: 40px;
		background-color: #e7e7e7;
		cursor: pointer;
		color: #000000;
		font-size: 18px;
		font-weight: 500;
		text-align: center;
		line-height: 40px;
		border-radius: 5px;
	}
</style>